<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>
<s:property value="#application.systemInfor.webName"/>－注册
</title>
<link href="css/style.css" rel="stylesheet" type="text/css" />
<link href="css/common.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/tools/jquery-1.4.2.min.js"></script>
<script>
$(document).ready(function(){
    $.post("groupbyajax/dic!getProvince.action",function(data)
     {
         $("#province").html('<option value="">请选择</option>'+data.province);
     });
});
 function changeValidateCode(obj) {     
        var timenow = new Date().getTime();    
        obj.src="groupbyajax/rand.action?d="+timenow;   
    }   
    
 var isSuccessEmail=false;
 function checkUserEmail()
 {
    var email=$.trim($("input[name='email']").val());
     var str = /^[\w\-\.]+@[\w\-\.]+(\.\w+)+$/;
     $("#errorInfor").remove();      
     
    if(email=="")
    {
      alert("Email 不能为空！");
      isSuccessEmail=false;
    }else if(!str.test(email))
    {
      alert("Email 格式不对！");
      isSuccessEmail=false;
    }else
    {
       
	    $.getJSON("groupbyajax/user!checkUserEmail.action",{email:email},function(data){
            var div='';
            if(!data.success)
            {
               isSuccessEmail=true;
               
               div="<span id='errorInfor' ><font color='blue'>Email 可以使用！</font></span>";
            }else
            {
               isSuccessEmail=false;
               div="<span id='errorInfor' ><font color='red'>Email 已经存在，请用其它的！</font></span>";
            }
            $("input[name='email']").after(div); 
            
	    });
    }
    return isSuccessEmail;
 }
 function getCity(pid)
 {
   $.post("groupbyajax/dic!getCity.action",{id:pid},function(data)
     {
         $("#cityId").html(data.city);
     });
     
 }
  var isSuccessRand=null;
 function checkRand()
 {
    var rand=$("input[name='rand']").val();
   if(rand!="")
   {
    $.post("groupbyajax/user!checkRand.action",{rand:rand},function(data)
     {
         if(!data.success)
         {
           alert("验证码错误！");
           isSuccessRand=false;
         } else
         {
            isSuccessRand=true;
         }
     });
    }else
    {
       alert("请输入验证码！");
        isSuccessRand=false;
    }
     return isSuccessRand;
 }
 
 function checkForm()
 {
       var email=checkUserEmail();
       
       if(!email)
       {
          return false;
       }
       var password=$.trim($("input[name='password']").val());
       var password2=$.trim($("input[name='password2']").val());
       
       if(password==""||password2==""||password!=password2)
       {
          alert("密码为空或两输入密码不一致！");
          return false;
       }else if(password.length<5||password.length>15)
       {
          alert("密码长度在5~15！");
          return false;
       }
       var city=$("#cityId").val();
       
       if(city==null)
       {
          alert("请选择城市！");
          return false;
       }
       var level=$("select[name='level']").val();
       if(level==3||level==4)
       {
         if(level==4)
         {
           var n=0;
           $("#categoryId option:selected").each(function(){
             n++;
           });
           if(n>2)
           {
             alert("品牌分类最多只能选择２个");
             return false;
           }
         }
          var tel=$.trim($("input[name='tel']").val());
          var trueName=$.trim($("input[name='trueName']").val());
          var address=$.trim($("textarea[name='address']").val());
          if(tel=="")
          {
             alert("请输入电话！");
             return false;
          }
          if(trueName=="")
          {
            alert("请输入真实姓名！");
             return false;
          }
          if(address==""||address.length>50)
          {
             alert("联系地址的字数不小于0或大于50！");
             return false;
          }
       }
       
      
       if(isSuccessRand==null||!isSuccessRand)
       {
          alert("验证码不正确");
          return false;
       }
       var tiaokuan=$("#tiaokuan").attr("checked");
       
       if(!tiaokuan)
       {
           alert("请先同意注册条款！");
           return false;
       }
       $("#userForm").submit();
 }
 function category()
 {
     
      var date=new Date();
       $.getJSON("groupbyajax/dic!getCategoryList.action?dateTime="+date.getTime(),{flag:3},function(data)
	     {
	     
	       var category="";
	       for(var i=0;i<data.category.length;i++)
	       {
	         category+="<option value='"+data.category[i].id+"'>"+data.category[i].categoryName+"</option>";
	       }
	      
	         $("#categoryId").html(category);
	     });
 }
 function selectLevel(obj)
 {
     if($(obj).val()==4)
     {
       $('#cid').show();
       category();
     }else
     {
       $('#cid').hide();
     }
     if($(obj).val()==4||$(obj).val()==3)
     {
       $("#telBox").show();
       $("#trueNameBox").show();
       $("#addressBox").show();
     }else
     {
        $("#telBox").hide();
       $("#trueNameBox").hide();
       $("#addressBox").hide();
     }
 }
</script>
</head>

<body>
<div class="container">


<jsp:include page="head.jsp"/> 

<div class="content">

<div class="input_lan">
请选择您需要的注册的用户类型，仅仅需要5分钟，您就可以拥有属于自已的个性页面。
</div>

<div class="wrap">
<form id="userForm" action="user!userRegister.action" method="post">
  <table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td width="51%" height="35"><span class="input_ziti">用户类型:</span></td>
    <td width="49%" height="25"><span class="input_ziti">》已经注册，直接登陆</span></td>
  </tr>
  <tr>
    <td height="35"><label>
      <select name="level" size="1" onchange="selectLevel(this)">
        <option value="2">个人用户</option>
        <option value="3">团购用户</option>
        <option value="4">品牌用户</option>
      </select>
    </label></td>
    <td height="25">&nbsp;</td>
  </tr>
   <tr id="cid" style="display:none">
    <td height="35"><span class="input_ziti">品牌分类：</span><label>
      <select name="categoryIds" id="categoryId" style="width:100px;height:100px;" multiple="multiple">
      </select>
    </label></td>
    <td height="25">&nbsp;</td>
  </tr>
  <tr>
    <td height="35"><span class="input_ziti">你的电子邮箱:</span></td>
    <td height="25">&nbsp;</td>
  </tr>
  <tr>
    <td height="25"><label>
      <input name="email" type="text" size="30" onblur="checkUserEmail()" />
    </label></td>
    <td rowspan="7" align="left" valign="top">
    <span class="input_ziti">注册说明：</span>&nbsp;&nbsp;&nbsp;&nbsp;选择你要注册后的用户类型以后，个人用户可以直接注册，其它用户类型需要在官方验证过方可以通过。</td>
  </tr>
  <tr>
    <td height="35"><span class="input_ziti">你的密码：</span></td>
    </tr>
  <tr>
    <td height="35"><label>
      <input name="password" type="password" size="30" />
    </label></td>
    </tr>
  <tr>
    <td height="25"><span class="input_ziti">密码确认：</span></td>
    </tr>
  <tr>
    <td height="35"><label>
      <input name="password2" type="password" size="30" />
    </label></td>
    </tr>
    <tr>
    <td height="25"><span class="input_ziti">所属城市：</span></td>
    </tr>
    <tr>
    <td height="35"><label>
      省：<select name="province" id="province" style="width:100px;" onchange="getCity($(this).val())"></select>
    </label><label>
      市：<select name="city" id="cityId" style="width:100px;"></select>
    </label></td>
    </tr>
    <tr id="telBox" style="display:none;">
    <td height="25"><span class="input_ziti">电话：</span><br /><br /><div><input type="text" name="tel" maxlength="11"/></div></td>
    </tr>
    <tr id="trueNameBox" style="display:none;">
    <td height="25"><span class="input_ziti">真实姓名：</span><br /><br /><div><input type="text" name="trueName" maxlength="10"/></div></td>
    </tr>
    <tr id="addressBox" style="display:none;">
    <td height="25"><span class="input_ziti">联系地址：</span><br /><br /><div><textarea name="address" rows="2" cols="25"></textarea></div></td>
    </tr>
  <tr>
    <td height="35"><span class="input_ziti">验证码:</span>
      <label>
      <img src="groupbyajax/rand.action" onclick="changeValidateCode(this)"/> <input name="rand" type="text" size="6" onblur="checkRand()"/>
      </label></td>
    </tr>
  <tr>
    <td><label>
      <input type="checkbox" id="tiaokuan" value="yes" />
    我已经看过并同意《<a href="system.action?id=2&flag=1">iooes网络服务协议</a>》</label></td>
    </tr>
  <tr>
    <td height="25" align="right" valign="middle"><img src="images/zhuce.jpg" width="151" height="30" onclick="checkForm()" /></td>
    <td>&nbsp;</td>
  </tr>
</table>
</form>
</div>

</div>

<div id="foot"><jsp:include page="bot.jsp"></jsp:include></div>

</div>
</body>
</html>
